<h3>客户</h3>

<div class="row m-b-10">
  <div class="col-md-1">
    <%= link_to '添加客户', new_customer_path, class: 'btn btn-default' if can? :create, Customer %>
  </div>
  <div class="col-md-11">
    <%= search_form_for @q, html: {class: 'pull-right form-inline'} do |f| %>
        <div class="form-group">
          <label>省市区</label>
          <%= f.select :province_id_eq, Region.where(level: 1).map{|r| [r.alias, r.id]}, {include_blank: true}, class: 'form-control', style: 'width: 80px;' %>
          <%= f.select :city_id_eq, sub_collection_for_select(@q.province_id_eq), {include_blank: true}, class: 'form-control', style: 'width: 80px;' %>
          <%= f.select :district_id_eq, sub_collection_for_select(@q.city_id_eq), {include_blank: true}, class: 'form-control', style: 'width: 80px;' %>
        </div>

        <div class="form-group">
          <label>街道</label>
          <%= f.search_field :street_cont, class: 'form-control', style: 'width: 150px;' %>
        </div>

        <div class="form-group">
          <label>详细地址</label>
          <%= f.search_field :address_cont, class: 'form-control', style: 'width: 150px;' %>
        </div>
        <%= f.button class: 'btn btn-default' do %>
            <i class="glyphicon glyphicon-search"></i> 查询
        <% end %>
    <% end %>
  </div>
</div>

<table class="table table-striped table-bordered">
  <thead>
  <tr>
    <th>名称</th>
    <th>手机</th>
    <th>邮箱</th>
    <th>微信号</th>
    <th>地址</th>
    <th>身份证号</th>
    <th>操作</th>
  </tr>
  </thead>

  <tbody>
  <% @customers.each do |customer| %>
      <tr>
        <td><%= customer.name %></td>
        <td><%= customer.phone %></td>
        <td><%= customer.email %></td>
        <td><%= customer.wechat %></td>
        <td><%= customer.full_address.truncate 15 %></td>
        <td><%= customer.try(:car).try :id_card_no %></td>
        <td>
          <%= link_to '详情', customer if can? :read, customer %>
          <%= link_to '编辑', edit_customer_path(customer) if can? :update, customer %>
        </td>
      </tr>
  <% end %>
  </tbody>
</table>

<%= render partial: 'shared/paginate', locals: {collection: @customers} %>

<%= content_for :javascript do %>
    <script>
      $(function(){
        var subSelect = function(select, subSelect){
            $(select).change(function(){
                var $this = $(this);
                var parentId = $this.val();

                if(parentId) {
                    $.get('/regions/' + parentId + '.json', function(region){
                        var options = '<option value></option>';
                        for(var i = 0; i < region.children.length; i++){
                            var r = region.children[i];
                            options += '<option value="'+ r.id +'">' + r.alias + '</option>';
                        }

                        $(subSelect).empty().append(options);
                        $(subSelect).change();
                    });
                } else {
                    $(subSelect).empty().change();
                }
            });
        };

          subSelect('#q_province_id_eq', '#q_city_id_eq');
          subSelect('#q_city_id_eq', '#q_district_id_eq');
      });
    </script>
<% end %>